import React, { Component, createRef } from 'react'
import echarts from 'echarts'
import {getData} from '../../api/dashboard'

export default class index extends Component {
  myref = createRef()
  componentDidMount () {
   getData()
    .then(res => {
      const data = JSON.parse(res.data.data)
      const tjdata = data.areaTree[0].children.map(area => ({
        name: area.name,
        value: area.total.nowConfirm
      }))
      this.draw(tjdata)
    })
  }
  draw = (tjdata) => {
    let arr = []
    let arr1 = []
    tjdata.forEach((a,b) => {
      arr.push(a.name)
      arr1.push(a.value)
    })
    arr = arr.slice(0,10)
    arr1 = arr1.slice(0,10)
    const myChart = echarts.init(this.myref.current)
    myChart.setOption({
      title: {
        text: '全国疫情统计图'
      },
      tooltip: {},
      legend: {
          data:['新增']
      },
      xAxis: {
          data: arr
      },
      yAxis: {},
      series: [{
          name: '新增',
          type: 'bar',
          data: arr1
      }]
    })
  }

  render() {
    return (
      <div>
        消息通知页面
        <div ref={this.myref} style={{width:'600px',height: '500px'}}></div>
      </div>
    )
  }
}
